<template>
    <div>
      <table>
        <tr>
          <th>_id</th>
          <th>id</th>
          <th>姓名</th>
          <th>年龄</th>
          <th>操作</th>
        </tr>
        <tr v-for="(item,index) in datas">
          <td>{{index+1}}</td>
          <td>{{item.name}}</td>
          <td>{{item.age}}</td>
          <td>
            <button @click="updete(index)">更新</button>
            <button @click="del(index)">删除</button>
          </td>
        </tr>
      </table>
      <h1 v-if="bol">创建</h1>
      <h1 v-else>更新</h1>
      姓名：<input type="text" v-model="username">
      年龄：<input type="text" v-model="age">
      <button @click="getFun()">提交</button>
    </div>
</template>

<script>
  import Axios from 'axios'
    export default {
      name: "node",
      data(){
        return {
          bol:true,
          username:'',
          age:'',
          id:'',
          datas:''
        }
      },
      methods:{
        getFun(){
          if (this.bol) {
            //创建
            var name = this.username;
            var age = this.age;
            Axios.get('http://10.90.89.118:8081/tijiao?name='+name+'&age='+age).then(res=>{
              console.log(res.data);
            });
            Axios.get('http://10.90.89.118:8081/all').then(res=>{
              this.datas = res.data
            });
          }else{
            //更新
            var name = this.username;
            var age = this.age;
            var id = this.id;
            Axios.get('http://10.90.89.118:8081/update?name='+name+'&age='+age+'&id='+id).then(res=>{
              console.log(res.data);
            });
            Axios.get('http://10.90.89.118:8081/all').then(res=>{
              this.datas = res.data
            });

          };
          this.bol = true;
          this.username = '';
          this.age = '';
          this.id = '';

        },
        updete(index){
          this.username = this.datas[index].name;
          this.age = this.datas[index].age;
          this.bol = false;
          this.id = this.datas[index]._id;
        },
        del(index){
          this.id = this.datas[index]._id;
          Axios.get('http://10.90.89.118:8081/del?id='+this.id).then(res=>{
            console.log(res.data);
          });
          Axios.get('http://10.90.89.118:8081/all').then(res=>{
            this.datas = res.data
          })
        }
      },
      mounted(){
        Axios.get('http://10.90.89.118:8081/all').then(res=>{
          this.datas = res.data
        })
      }
    }
</script>

<style scoped>

</style>
